.report-container {
	padding: 24rpx;
	.report-bg {
		top: 0;
		left: 0;
		width: 100%;
		height: 658rpx;
		position: fixed;
		background-image: url('~@/static/image/page-bg.png');
		background-size: 100% auto;
		background-repeat: no-repeat;
		pointer-events: none;
		z-index: 0;
	}
	.report-main {
		position: relative;
		z-index: 1;
	}
	.cc-row {
		display: flex;
		gap: 24rpx;
	}
	.cc-col {
		flex: 1;
	}
	.card {
		position: relative;
		background-color: #fff;
		border-radius: 16rpx;
		box-shadow: $cc-shadow;
	}
	.card-total {
		.cc-col {
			padding: 24rpx;
			height: 216rpx;
			display: flex;
			flex-direction: column;
			justify-content: space-around;
		}
	}
	.card-label {
		color: $u-info;
	}
	.card-value {
		font-weight: 600;
		.dinpro {
			font-size: 52rpx;
		}
	}
	.card-chart {
		min-height: 500rpx;
	}
	.card-title {
		padding: 24rpx 32rpx 0;
		font-weight: 600;
		font-size: 32rpx;
	}
	.card-bg-blue {
		background-color: $u-primary-light;
	}
	.card-tips {
		position: absolute;
		right: 24rpx;
		top: 40rpx;
		z-index: 1;
		&-text {
			padding: 24rpx;
			font-size: 28rpx;
			box-shadow: $cc-shadow;
			width: 586rpx;
			background-color: $u-primary-light;
			box-shadow: $cc-shadow;
		}
	}
	.refresh-icon {
		width: 28rpx;
		height: 28rpx;
		overflow: hidden;
	}
}
/* 定义旋转动画 */
@keyframes rotateAnimation {
	from {
		transform: rotate(0deg);
	}
	to {
		transform: rotate(360deg);
	}
}

/* 应用旋转动画到元素 */
.rotating {
	animation: rotateAnimation 2s linear infinite; /* 持续时间2秒，线性速度，无限次播放 */
}
